@import './mixins';

// 按钮尺寸
@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $border-radius) {
  padding: $padding-vertical $padding-horizontal;
  font-size: $font-size;
  border-radius: $border-radius;
}

// 按钮不同修饰器下的颜色
@mixin button-variant($background-color, $border-color, $text-color) {
  color: $text-color;
  background-color: $background-color;
  border-color: $border-color;

  &:hover,
  &:focus,
  &:active {
    background-color: rgba($background-color, 0.8);
    border-color: rgba($border-color, 0.6);
    color: $text-color;
  }

  // 朴素
  @include when(plain) {
    background-color: rgba($background-color, 0.1);
    border-color: rgba($border-color, 0.3);
    color: $background-color;

    &:hover,
    &:focus,
    &:active {
      background-color: rgba($background-color, 0.8);
      border-color: rgba($border-color, 0.6);
      color: $text-color;
    }
  }

  // 禁用
  @include when(disabled) {
    background-color: rgba($background-color, 0.6);
    border-color: rgba($border-color, 0.2);
    color: $text-color;

    &:hover,
    &:focus,
    &:active {
      background-color: rgba($background-color, 0.6);
      border-color: rgba($border-color, 0.2);
      color: $text-color;
    }
  }
}
